<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">

		<title>花鸟鱼虫特卖网</title>

		<link href="../AmazeUI-2.4.2/assets/css/amazeui.css" rel="stylesheet" type="text/css" />
		<link href="../AmazeUI-2.4.2/assets/css/admin.css" rel="stylesheet" type="text/css" />

		<link href="../basic/css/demo.css" rel="stylesheet" type="text/css" />

		<link href="../css/hmstyle.css" rel="stylesheet" type="text/css" />
		<script src="../AmazeUI-2.4.2/assets/js/jquery.min.js"></script>
		<script src="../AmazeUI-2.4.2/assets/js/amazeui.min.js"></script>
		<script src="../js/common.js"></script>
	</head>

	<body>
		<div class="hmtop">
			<!--顶部导航条 -->
			<div class="am-container header">
				<ul class="message-l">
					<div class="topMessage">
						<div class="menu-hd" id="indexHeader">

						</div>
					</div>
				</ul>
				<ul class="message-r">
					<div class="topMessage home">
						<div class="menu-hd">
							<a href="index.html" target="_top" class="h">商城首页</a>
						</div>
					</div>
					<div class="topMessage my-shangcheng">
						<div class="menu-hd MyShangcheng">
							<a href="pindex.html" target="_top"><i class="am-icon-user am-icon-fw"></i>个人中心</a>
						</div>
					</div>
					<div class="topMessage mini-cart">
						<div class="menu-hd">
							<a id="mc-menu-hd" href="shopcart.html" target="_top"><i class="am-icon-shopping-cart  am-icon-fw"></i><span>购物车</span><strong id="J_MiniCartNum" class="h"></strong></a>
						</div>
					</div>
				</ul>
				</div>

				<!--悬浮搜索框-->

				<div class="nav white">
					<div class="logo"></div>
					<div class="logoBig">
					<img src="../images/1538810784_143494.png" style="height: 50px;width: 300px"/>
					</div>

					<div class="search-bar pr">
						<a name="index_none_header_sysc" href="#"></a>
						<form onSubmit="fun1();return false;">
							<input id="searchInput" name="index_none_header_sysc" type="text" placeholder="输入商品名称" autocomplete="off">
							<input id="ai-topsearch" class="submit am-btn" value="搜索" index="1" type="button">
						</form>
					</div>
				</div>

				<div class="clear"></div>
			</div>

			<div class="banner" style="border-top: 0px">
				<!--轮播 -->
				<div class="am-slider am-slider-default scoll" data-am-flexslider id="demo-slider-0">
					<ul class="am-slides">
						<li class="">
							<a href="#"><img src="../images/banner1.jpg" /></a>
						</li>
						<li class="">
							<a><img src="../images/banner2.jpg" /></a>
						</li>
					</ul>
				</div>
				<div class="clear"></div>
			</div>

			<div class="shopNav">
				<div class="slideall">

					<div class="long-title" style="background: #ffffff"><span class="all-goods" style="color: #333">全部分类</span></div>
					<div class="nav-cont">
						<ul>
							
						</ul>
					</div>

					<!--侧边导航 -->
					<div id="nav" class="navfull">
						<div class="area clearfix">
							<div class="category-content" id="guide_2">
								<div class="category" style="background: #ffffff;color: black;border:0">
									<ul class="category-list" id="js_climit_li"></ul>
								</div>
							</div>
						</div>
					</div>
					<!--轮播 -->
					<script type="text/javascript">
						(function() {
							$('.am-slider').flexslider();
						});
						$(document).ready(function() {
							$("li").hover(function() {
								$(".category-content .category-list li.first .menu-in").css("display", "none");
								$(".category-content .category-list li.first").removeClass("hover");
								$(this).addClass("hover");
								$(this).children("div.menu-in").css("display", "block")
							}, function() {
								$(this).removeClass("hover")
								$(this).children("div.menu-in").css("display", "none")
							});
						})
					</script>

					<div class="clear"></div>
				</div>
				<script type="text/javascript">
					if($(window).width() < 640) {
						function autoScroll(obj) {
							$(obj).find("ul").animate({
								marginTop: "-39px"
							}, 500, function() {
								$(this).css({
									marginTop: "0px"
								}).find("li:first").appendTo(this);
							})
						}
						$(function() {
							setInterval('autoScroll(".demo")', 3000);
						})
					}
				</script>
			</div>
			<div class="shopMainbg">
				<div class="shopMain" id="shopmain">
					<!--热门 -->
					<div class="am-container activity ">
					<div class="shopTitle ">
						<h4>热门商品</h4>
					</div>
					<div class="am-g am-g-fixed ">
						<div class="am-u-sm-3 ">
							<div class="activityMain ">
								<a id="goodsurl1"><img id="goodImg1"></img></a>
							</div>
						</div>
						
						<div class="am-u-sm-3 ">
							<div class="activityMain ">
								<a id="goodsurl2"><img id="goodImg2" src=""></img></a>
							</div>
						</div>						
						
						<div class="am-u-sm-3 ">
							<div class="activityMain ">
								<a id="goodsurl3"><img id="goodImg3" src=""></img></a>
							</div>
						</div>		
						
						<div class="am-u-sm-3 ">
							<div class="activityMain ">
								<a id="goodsurl4"><img id="goodImg4" src=""></img></a>
							</div>
						</div>	

						<div class="am-u-sm-3 last ">
							<div class="activityMain ">
								<a id="goodsurl5"><img id="goodImg5" src=""></img></a>
							</div>
						</div>
					  </div>
                   </div>
					<div class="clear "></div>
					<div class="footer" style="border-top: 2px solid #222;">
						<div class="footer-hd ">
						</div>
					</div>
				</div>
			</div>
		</div>
		</div>
		<!--引导 -->
		<script>
			window.jQuery || document.write('<script src="basic/js/jquery.min.js "><\/script>');
		</script>
		<script type="text/javascript " src="../basic/js/quick_links.js "></script>
		<script type="text/javascript">
			
			$(function(){
				/*查询所有的父类别以及子类别*/
				$.ajax({
					type:"get",
					url:"/goodstype/allTypes",
					async:false,
					success:function(result){
						for(var i=0;i<result.length;i++){
							var html=`
								<li class="appliance js_toggle relative first">
	                                <div class="category-info">
	                                <h3 class="category-name b-category-name">
	                                        <a class="ml-22" >${result[i].typename}</a>
	                                    </h3>
	                                <em>&gt;</em></div>
	                            <div class="menu-item menu-in top">
	                                <div class="area-in">
	                                    <div class="area-bg">
	                                        <div class="menu-srot">
	                                            <div class="sort-side">
	                                                <dl class="dl-sort-${i}">
	                                                </dl>
	                                            </div>
	                                        </div>
	                                    </div>
	                                </div>
	                            </div>
	                            <b class="arrow"></b>
	                           </li>`;
                        
							$("#js_climit_li").append(html);
							for(var j=0;j<result[i].childTypes.length;j++){
								$(".dl-sort-"+i).append(
										`<dd>
		                                <a title="" href="/portal/home/search.html?typeid=${result[i].childTypes[j].id}"><span>${result[i].childTypes[j].typename}</span></a>
		                                </dd>`)
								}
							}
					}
				});
				
				$(document).ready(function() {
                    $("li").hover(function() {
                        $(".category-content .category-list li.first .menu-in").css("display", "none");
                        $(".category-content .category-list li.first").removeClass("hover");
                        $(this).addClass("hover");
                        $(this).children("div.menu-in").css("display", "block")
                    }, function() {
                        $(this).removeClass("hover")
                        $(this).children("div.menu-in").css("display", "none")
                    });
                })
				
				/*查询销量TOP5的商品*/
			    $.ajax({
			    	type:"get",
			    	url:"/goods/selectTop5",
			    	async:true,
			    	success:function(result){
			    		for(var i=0;i<result.length;i++){
			    			$("#goodImg"+(i+1)).attr("src",result[i].img1);
			    			//$("#goodName"+(i+1)).text(result[i].goodsname);
			    			$("#goodsurl"+(i+1)).attr("href","introduction.html?goodsid="+result[i].id);
			    		}
			    	}
			    });
				
				
				/*检验用户是否登录*/
				if (getCookie("username") == null || getCookie("userid") == null) {
                    $("#indexHeader").append(`
                    		<a href="/portal/home/login.html" target="_top" class="h">亲，请登录</a>
                            <a href="/portal/home/register.html" target="_top">免费注册</a>`);
			    }else{
			    	$("#indexHeader").append(`
                            <a href="#" target="_top" class="h">您好，${getCookie("username")}</a>
                            <a href="javascript:void(0);" onclick="clearCookie()">退出</a>`
                    );
			    }
			    
			    
			    /*搜索框*/
			    $("#ai-topsearch").click(function(){
			    	var searchInput=$("#searchInput").val();
			    	var url=encodeURI('namesearch.html?search='+searchInput);
			    	window.location.href=url;
			    })
			})
			
		</script>
		<script>
			function gotoShopcart(){
		    	window.location.href="shopcart.html";
		    }
			
			function fun1(){
				var searchInput=$("#searchInput").val();
		    	var url=encodeURI('namesearch.html?search='+searchInput);
		    	window.location.href=url;
			}
		</script>
	</body>

</html>